\documentclass[a4paper]{report}
\usepackage[utf8x]{inputenc}
\usepackage[francais]{babel}
\usepackage{ucs}
\usepackage{amsmath}
\usepackage{amsfonts}
\usepackage{amssymb}
\usepackage{makeidx}
\usepackage{pdfpages}
\usepackage{ifpdf}
\usepackage{graphics,graphicx}
\usepackage{caption}

\usepackage{url}
\urlstyle{tt}

\renewcommand{\familydefault}{\sfdefault}
\renewcommand{\ttdefault}{pcr}

\title{Étude ergonomique de logiciels en Delphi}
\author{Joe R. Nassimian}
\date{\today}



\def\ClassName{LIFSTI}
\def\ClassDesc{Interaction Homme-Machine}

\def\DocType{project report}
\def\TypeDoc{Rapport de projet}

\def\CharlieFirstName{Joe}
\def\CharlieMiddleName{R.}
\def\CharlieLastName{Nassimian}
\def\CharlieFullName{\CharlieFirstName \space \CharlieMiddleName \space \CharlieLastName}
\def\CharlieMail{nassimian.joseph@gmail.com}

\def\FoxtrotFirstName{Yannis}
\def\FoxtrotMiddleName{}
\def\FoxtrotLastName{Mazzer}
\def\FoxtrotFullName{\FoxtrotFirstName \space \FoxtrotMiddleName \space \FoxtrotLastName}
\def\FoxtrotMail{yannis@mazzer.info}

\def\FileAuthor{\CharlieFullName \space \& \space \FoxtrotFullName}
\def\FileTitle{\FileAuthor's \space \ClassName \space \DocType}
\def\FileSubject{\ClassName \space \DocType}
\def\FileKeyWords{\FileAuthor, \ClassName \DocType}

\author{\FileAuthor \\ 
{\small \CharlieMail \space -- \space \FoxtrotMail }}
\title{\ClassName \space -- \space \ClassDesc \\ {\Large \TypeDoc}}
 
\ifpdf
  \usepackage[pdftex,pdfborder=0,colorlinks=true,linkcolor=blue,baseurl=http://,pdfpagemode=None,pdfstartview=XYZ,pdfstartpage=1]{hyperref}
  \hypersetup{
	colorlinks	= true, 
	linkcolor	= blue,  
	anchorcolor	= blue,  
	citecolor	= blue, 
	filecolor	= blue, 
	menucolor	= blue, 
	pagecolor	= blue,  
	urlcolor	= blue,
    pdfauthor   = \FileAuthor,%
    pdftitle    = \FileTitle,%
    pdfsubject  = \FileSubject,%
    pdfkeywords = \FileKeyWords,%
    pdfcreator  = \LaTeX,%
    pdfproducer = \LaTeX}
\else
  \usepackage[dvips]{hyperref}
\usepackage{graphicx}
\usepackage{caption}
\fi

\begin{document}

\maketitle
\tableofcontents
\clearpage

Nous allons réaliser l'étude ergonomique de deux logiciel de gestions de classes 
qui sont developpé en Delphi dans le cadre de l'unité d'étude :\\
\ClassName -- \ClassDesc.

Le premier projet étudié est celui developpé par nous même : Joe Nassimian et 
Yannis Mazzer.
Le deuxième projet étudié est celui developpé par le binôme constitué par : 
Nina Jabbour et Hamza Ouedghiri ben Othmane.

\clearpage

\section{Étude ergonomique de : oclassmanager}
Ce logiciel a été réalisé par Joe et Yannis, avec la version 2007 de 
CodeGear Delphi. Le control de version Subversion a été utilisé pour pouvoir
travailler efficacement à deux sur ce projet, et \LaTeX{} pour produire ce document.

\textbf{N.B. Ce logiciel n'est pas terminé, certaines fonctionnalités sont manquantes.}

Au lancement de l'application, une fenêtre de connexion apparait :

\begin{minipage}{0.5\linewidth}
	\includegraphics[width=\linewidth]{screenshot-00.JPG}
\end{minipage}
\begin{minipage}{0.5\linewidth}
	\includegraphics[width=\linewidth]{screenshot-01.JPG}
\end{minipage}
\captionof{figure}{Fenêtre de connexion}
\label{fig:connexion}
~~\\

Nous remarquons quatre cas :
\begin{itemize}
	\item Le cas où l'identifiant n'est pas connu : \\
		\begin{center}\includegraphics[scale=0.75]{screenshot-02.JPG}\end{center}
	\item Le cas où le mot de passe est faux : \\
		\begin{center}\includegraphics[scale=0.75]{screenshot-04.JPG}\end{center}
	\item Le cas où la selection du rôle n'a pas été fait : \\
		\begin{center}\includegraphics[scale=0.75]{screenshot-03.JPG}\end{center}
	\item Le cas où l'identification a réussie : \\
		\begin{center}\includegraphics[scale=0.75]{screenshot-05.JPG}\end{center}
\end{itemize}
~~\\

Suite à la connexion, la fenêtre principale de l'application apparait. Nous 
remarquons que le programme est organisé en MDI : l'organisation de l'interface 
graphique de l'application contiennent en leur sein des fenêtres enfants.
\begin{center}
	\includegraphics[scale=0.60]{screenshot-06.JPG}
	\captionof{figure}{Fenêtre principale}
	\label{fig:mainform}
\end{center}

Les fenêtres enfants ne sont pas affichés au lancement pour le moment, et les 
vues étudiants et professeurs ne sont pas séparés encore. Ces fenêtre  sont 
accessibles via le menu ``fenêtre".
\begin{center}
	\includegraphics[scale=0.80]{screenshot-09.JPG}
	\captionof{figure}{Le menu ``fenêtre"}
	\label{fig:windowMenu}
\end{center}


La première fenêtre qu'on a dans la liste est intitulé ``Description", qui dans 
la version finale deviendra ``profile" pour être plus concis.
Cette fenêtre permet à la personne de consulter, et modifier les informations de 
leurs profile, comme les coordonnées.
\begin{center}
	\includegraphics[scale=0.50]{screenshot-11.JPG}
	\captionof{figure}{Fenêtre : Description}
	\label{fig:description}
\end{center}

On distingue bien les champs ne pouvant pas être modifiés (nom, prénom, numéro
d'étudiant) de celles qui sont éditables. De plus, aucune modification accidentelle n'est
possible car il faut cliquer sur le bouton Modifier pour que les champs deviennent
éditables.
\begin{center}
	\includegraphics[scale=0.50]{screenshot-12.JPG}
	\captionof{figure}{Fenêtre : Édition des coordonnées}
	\label{fig:coordonnees}
\end{center}

La fenêtre ``Liste des étudiants" contient une liste d'étudiants associées aux
enseignements qu'ils suivent, mais sans action possible pour le moment. Dans la 
version finale, cette fenêtre devrait permettre à un étudiant de consulter la 
liste des élèves de chacune de ses classes.
\begin{center}
	\includegraphics[scale=0.50]{screenshot-15.JPG}
	\captionof{figure}{Fenêtre : Liste des étudiants}
	\label{fig:studentliste}
\end{center}

La dernière fenêtre, "Gestion des classes", permet d'ajouter et de supprimer des 
classes et des élèves aux classes. Cette fenêtre sera spécifique a un compte de 
professeur. Des messages d'erreur du même type que ceux de la fenêtre 
d'identification apparaissent pour confirmer une suppression d'un élève ou d'une
classe.
\begin{center}
	\includegraphics[scale=0.65]{screenshot-16.JPG}
	\captionof{figure}{Fenêtre : Gestion des classes}
	\label{fig:management}
\end{center}

Ces trois fenêtres peuvent être organisées différemment (alignées verticalement 
alignées horizontalement ou affichées en cascade) grace au bouton à droite de la 
barre d'outils.
	
La barre latérale est prévue pour contenir des boutton avec les nom des 
différentes fenêtre pour pouvoir les rendres plus accessible et visible à 
l'utilisateur.


\section{Étude ergonomique de : Project3}
Ce logiciel a été réalisé par le binome : Nina Jabbour et Hamza Ouedghiri ben 
Othmane.
~~\\

\textbf{Le logiciel est incomplet.}
~~\\

Au lancement de l'application, une fenêtre d'accueil apparait permettant soit de
s'identifier, soit de quitter l'application:
\begin{center}
	\includegraphics[scale=0.80]{projet3-page-accueil.JPG}
	\captionof{figure}{Fenêtre : Accueil}
	\label{fig:home}
\end{center}

Suite à un clique sur le boutton d'identification, une fenêtre d'identification 
apparait:
\begin{center}
	\includegraphics[scale=0.65]{projet3-authentification.JPG}
	\captionof{figure}{Fenêtre : Identification}
	\label{fig:login}
\end{center}
~~\\

Nous remarquons 3 cas :
\begin{itemize}
	\item Echec de la connexion, un message est affiché sur l'écran.
	\begin{center}\includegraphics[scale=0.70]{projet3-loginerror.JPG}
		\captionof{figure}{Fenêtre : Erreur de connexion}
		\label{fig:loginerror}
		\end{center}
~~\\
	\item L'identification d'un professeur a réussie, l'accueil et la 
	fenêtre d'identification disparaissent puis le menu spécifique 
	à un professeur apparait.
	On peut cliquer sur ajouter une nouvelle classe, mais on a aucune 
	indication sur la modification ou la suppression. Il serait plus évident
	 de nommer ce boutton ``Gestion des classes".
	\begin{center}\includegraphics[scale=0.60]{projet3-menu-enseignant.JPG}
		\captionof{figure}{Fenêtre : Menu d'un Professeur}
		\label{fig:profmenu}
		\end{center}
~~\\	
	\item L'identification d'un étudiant a réussie, l'accueil et la 
	fenêtre d'identification disparaissent puis le menu spécifique à un 
	étudiant apparait. Ce menu permet à l'étudiant de consulter les 
	informations personnelles, les notes et les absences.
	\begin{center}\includegraphics[scale=0.60]{projet3-menu-eleve.JPG}
		\captionof{figure}{Fenêtre : Menu d'un élève}
		\label{fig:stumenu}
		\end{center}
\end{itemize}
~~\\

Nous constatons pour le moment que les fenêtres apparaissent à des endroits 
différents de l'écran, sans homogénéïté de l'emplacement et les dimensions.

Dans le menu du professeur, en cliquant sur le premier liens, nous obtenons la 
fenêtre qui permet l'ajout, la suppression et la modification :
\begin{center}
	\includegraphics[scale=0.75]{projet3-nouvelle-classe.JPG}
	\captionof{figure}{Fenêtre : Nouvelle Classe}
	\label{fig:newclasse}
\end{center}

Cette fenêtre est incomplète et présente certaine incohérence:
\begin{itemize}
	\item Le nombre d'élève doit être un label mis-à-jour suite à un calcul 
	automatique à l'affichage, ou après ajout ou suppression de classes. Car
	un champ de saisie suggère une saisie manuelle.
	\item Pas de boutton d'ajout et de suppression, avec 2 listes d'éléments
	sans aucune description : Nous ne savons pas a quoi ces listes 
	correspondent.
	\item L'ajout et la suppression de classe est utilisé aussi pour l'ajout
	des élèves dans les classes en passant par un Combobox. La convention 
	d'usage veut qu'un Combobox soit utilisé pour une séléction, alors qu'ici
	la combobox est utilisé pour supprimer et ajouter des classes dedans, ce
	qui n'est pas simple et évident.
\end{itemize}

Nous revenons au menu de l'enseignant, pour étudier la fenêtre ``Saisir les 
notes des élèves" :
\begin{center}
	\includegraphics[scale=0.70]{projet3-Notes-bis.JPG}
	\captionof{figure}{Fenêtre : Saisie de notes}
	\label{fig:grading}
\end{center}

Il n'est pas évident de constater que la liste déroulante des classes de la 
fenêtre précedente est nommer niveau dans cette fenêtre. 
De plus, la possibilité de pouvoir mettre une note et cocher une absence en même
temps peut poser problème. Un exemple pour remédier à ce problème serait de 
griser la case de saisie de note en cas d'absence et de mettre un zero par
exemple.

En ce qui concerne le menu étudiant, nous pouvons consulter nos informations 
personelles et nos notes :
\begin{itemize}
	\item Cette fenêtre est clair et concis mais ne prévois pas de 
	modifications.
	\begin{center}\includegraphics[scale=0.75]{projet3-Info-perso.JPG}
		\captionof{figure}{Fenêtre : Informations Personnelles}
		\label{fig:infoperso}
	\end{center}
	\item La dernière fenêtre destiné à la consultation des notes et des 
	absences pour l'élève. Comme pour la fenêtre précente, la présentation 
	est clair et concis. Cepedant la liste des absences est statique : un 
	nombre d'absence fixe, qui pourrait poser problème pour noter l'absence
	des étudiants tourristes.
	\begin{center}\includegraphics[scale=0.75]{projet3-consultation-notes.JPG}
		\captionof{figure}{Fenêtre : Consultation note et absence}
		\label{fig:consultation}
	\end{center}
\end{itemize}








\end{document}
